<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="" prop="matchDate">
        <el-date-picker clearable
                        v-model="queryParams.matchDate"
                        type="date"
                        value-format="YYYY-MM-DD HH:mm:ss"
                        placeholder="请选择比赛日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="" prop="matchFlag">
        <el-input
          v-model="queryParams.matchFlag"
          placeholder="标识"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="rq">
        <el-input
          v-model="queryParams.rq"
          placeholder="让球"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="minMainWinOdds">
        <el-input
          v-model="queryParams.minMainWinOdds"
          placeholder="最小主胜"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="maxMainWinOdds">
        <el-input
          v-model="queryParams.maxMainWinOdds"
          placeholder="最大主胜"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="levelOdds">
        <el-input
          v-model="queryParams.levelOdds"
          placeholder="平胜"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="minGustWinOdds">
        <el-input
          v-model="queryParams.minGustWinOdds"
          placeholder="最小客胜"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="maxGustWinOdds">
        <el-input
          v-model="queryParams.maxGustWinOdds"
          placeholder="最大客胜"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="rqMinMainWinOdds">
        <el-input
          v-model="queryParams.rqMinMainWinOdds"
          placeholder="最小让主胜"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="rqMaxMainWinOdds">
        <el-input
          v-model="queryParams.rqMaxMainWinOdds"
          placeholder="最大让主胜"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="rqLevelOdds">
        <el-input
          v-model="queryParams.rqLevelOdds"
          placeholder="让平胜"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="rqMinGustWinOdds">
        <el-input
          v-model="queryParams.rqMinGustWinOdds"
          placeholder="最小让客胜"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="rqMaxGustWinOdds">
        <el-input
          v-model="queryParams.rqMaxGustWinOdds"
          placeholder="最大让客胜"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="matchResult">
        <el-input
          v-model="queryParams.matchResult"
          placeholder="赛果"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="rqResult">
        <el-input
          v-model="queryParams.rqResult"
          placeholder="让球赛果"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="rqResult">
        <el-input
          v-model="queryParams.matchScore"
          placeholder="比分赛果"
          clearable
          @keyup.enter="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
<!--      <el-col :span="1.5">-->
<!--        <el-button-->
<!--          type="primary"-->
<!--          plain-->
<!--          icon="Plus"-->
<!--          @click="handleAdd"-->
<!--          v-hasPermi="['match:historyMatch:add']"-->
<!--        >新增</el-button>-->
<!--      </el-col>-->
<!--      <el-col :span="1.5">-->
<!--        <el-button-->
<!--          type="success"-->
<!--          plain-->
<!--          icon="Edit"-->
<!--          :disabled="single"-->
<!--          @click="handleUpdate"-->
<!--          v-hasPermi="['match:historyMatch:edit']"-->
<!--        >修改</el-button>-->
<!--      </el-col>-->
<!--      <el-col :span="1.5">-->
<!--        <el-button-->
<!--          type="danger"-->
<!--          plain-->
<!--          icon="Delete"-->
<!--          :disabled="multiple"-->
<!--          @click="handleDelete"-->
<!--          v-hasPermi="['match:historyMatch:remove']"-->
<!--        >删除</el-button>-->
<!--      </el-col>-->
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="Download"
          @click="handleExport"
          v-hasPermi="['match:historyMatch:export']"
        >导出</el-button>
      </el-col>
      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="historyMatchList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="主键" align="center" prop="id" v-if="false"/>
      <el-table-column label="比赛日期" align="center" prop="matchDate" width="180">
        <template #default="scope">
          <span>{{ parseTime(scope.row.matchDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="标识" align="center" prop="matchFlag">
        <template #default="scope">
          <el-link type="primary" @click="handleView(scope.row)">{{scope.row.matchFlag}}</el-link>
        </template>
      </el-table-column>
      <el-table-column label="主队" align="center" prop="mainTeamName" />
      <el-table-column label="客队" align="center" prop="gustTeamName" />
      <el-table-column label="让球" align="center" prop="rq" />
      <el-table-column label="主胜" align="center" prop="mainWinOdds" />
      <el-table-column label="平胜" align="center" prop="levelOdds" />
      <el-table-column label="客胜" align="center" prop="gustWinOdds" />
      <el-table-column label="让球主胜" align="center" prop="rqMainWinOdds" />
      <el-table-column label="让球平胜" align="center" prop="rqLevelOdds" />
      <el-table-column label="让球客胜" align="center" prop="rqGustWinOdds" />
      <el-table-column label="0:1" align="center" prop="cs01" />
<!--      <el-table-column label="0:2" align="center" prop="cs02" />-->
<!--      <el-table-column label="0:3" align="center" prop="cs03" />-->
<!--      <el-table-column label="0:4" align="center" prop="cs04" />-->
<!--      <el-table-column label="0:5" align="center" prop="cs05" />-->
      <el-table-column label="1:0" align="center" prop="cs10" />
      <el-table-column label="1:2" align="center" prop="cs12" />
<!--      <el-table-column label="1:3" align="center" prop="cs13" />-->
<!--      <el-table-column label="1:4" align="center" prop="cs14" />-->
<!--      <el-table-column label="1:5" align="center" prop="cs15" />-->
<!--      <el-table-column label="2:0" align="center" prop="cs20" />-->
      <el-table-column label="2:1" align="center" prop="cs21" />
      <el-table-column label="2:3" align="center" prop="cs23" />
<!--      <el-table-column label="2:4" align="center" prop="cs24" />-->
<!--      <el-table-column label="2:5" align="center" prop="cs25" />-->
<!--      <el-table-column label="3:0" align="center" prop="cs30" />-->
<!--      <el-table-column label="3:1" align="center" prop="cs31" />-->
      <el-table-column label="3:2" align="center" prop="cs32" />
<!--      <el-table-column label="4:0" align="center" prop="cs40" />-->
<!--      <el-table-column label="4:1" align="center" prop="cs41" />-->
<!--      <el-table-column label="4:2" align="center" prop="cs42" />-->
<!--      <el-table-column label="5:0" align="center" prop="cs50" />-->
<!--      <el-table-column label="5:1" align="center" prop="cs51" />-->
<!--      <el-table-column label="5:2" align="center" prop="cs52" />-->
      <el-table-column label="0:0" align="center" prop="level00" />
      <el-table-column label="1:1" align="center" prop="level11" />
      <el-table-column label="2:2" align="center" prop="level22" />
      <el-table-column label="3:3" align="center" prop="level33" />
<!--      <el-table-column label="平其他" align="center" prop="levelOther" />-->
<!--      <el-table-column label="胜其他" align="center" prop="winOther" />-->
<!--      <el-table-column label="负其他" align="center" prop="lostOther" />-->
<!--      <el-table-column label="总0" align="center" prop="jq0" />-->
<!--      <el-table-column label="总1" align="center" prop="jq1" />-->
<!--      <el-table-column label="总2" align="center" prop="jq2" />-->
<!--      <el-table-column label="总3" align="center" prop="jq3" />-->
<!--      <el-table-column label="总4" align="center" prop="jq4" />-->
<!--      <el-table-column label="总5" align="center" prop="jq5" />-->
<!--      <el-table-column label="总6" align="center" prop="jq6" />-->
<!--      <el-table-column label="总大于6" align="center" prop="jqGt6" />-->
<!--      <el-table-column label="赛果" align="center" prop="matchResult" />-->
      <el-table-column label="赛果比分" align="center" prop="matchScore" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template #default="scope">
<!--          <el-button link type="primary" icon="View" @click="handleView(scope.row)" >查看</el-button>-->
          <el-button link type="primary" icon="View" @click="historyView(scope.row)" >查看</el-button>
          <el-button link type="primary" icon="View" @click="matchRangeRef.open(scope.row.id)" >查看看</el-button>
<!--          <el-button link type="primary" icon="View" @click="handleMaxView(scope.row)" >放大查看</el-button>-->
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      v-model:page="queryParams.pageNum"
      v-model:limit="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改【请填写功能名称】对话框 -->
    <el-dialog :title="title" v-model="open" width="1500px" append-to-body>
      <el-divider content-position="left">基础信息</el-divider>
      <el-row :gutter="12">
        <el-col :span="12">
          <el-card class="box-card">
            <el-descriptions title="胜率" :column="3">
              <el-descriptions-item label="主胜">{{form.match.mainWinOdds}}</el-descriptions-item>
              <el-descriptions-item label="平胜">{{form.match.levelOdds}}</el-descriptions-item>
              <el-descriptions-item label="客胜">{{form.match.gustWinOdds}}</el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="12">
          <el-card class="box-card">
            <el-descriptions title="让球胜率" :column="3">
              <el-descriptions-item label="让主胜">{{form.match.rqMainWinOdds}}</el-descriptions-item>
              <el-descriptions-item label="让平胜">{{form.match.rqLevelOdds}}</el-descriptions-item>
              <el-descriptions-item label="让客胜">{{form.match.rqGustWinOdds}}</el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row >
      <el-divider content-position="left">比分信息</el-divider>
      <el-row >
        <el-col>
          <el-card class="box-card">
            <table>
              <thead>
              <tr>
                <th v-for="head in form.currentMatchRangeList">
                  {{head.type}}
                </th>
              </tr>
              </thead>
              <tbody>
              <tr >
                <td v-for="body in  form.currentMatchRangeList">
                  <el-row v-for="bd in body.csList">
                    <el-button round size="small">
                      {{bd.label + "("+bd.num+")"}}
                    </el-button>
                  </el-row>

                </td>

              </tr>
              </tbody>
            </table>
          </el-card>
        </el-col>
      </el-row>
      <el-divider content-position="left">非让球分析</el-divider>
      <el-row :gutter="12">
        <el-col :span="12">
          <el-card class="box-card">
            <el-descriptions title="正向进球预测"  direction="vertical" :column="1">
                <el-descriptions-item label="" v-for="(item,index) in form.jqForecastList" >
                  <span  :class="index === 5 ? 'text-red' : ''">
                    <el-divider direction="vertical" />
                    {{item.name}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.mainWinOdds+"("+item.resultForecast.mainNum+")"}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.levelWinOdds+"("+item.resultForecast.levelNum+")"}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.gustWinOdds+"("+item.resultForecast.gustNum+")"}}
                    <el-divider direction="vertical" />
                  </span>
                </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="12">
          <el-card class="box-card">
            <el-descriptions title="反向进球预测"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="(item,index) in form.jqReverseForecastList" >
                  <span  :class="index === 5 ? 'text-red' : ''">
                 <el-divider direction="vertical" />
                    {{item.name}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.mainWinOdds+"("+item.resultForecast.mainNum+")"}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.levelWinOdds+"("+item.resultForecast.levelNum+")"}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.gustWinOdds+"("+item.resultForecast.gustNum+")"}}
                    <el-divider direction="vertical" />
                    </span>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row>
<!--      <el-row :gutter="12">-->
<!--        <el-col :span="12">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="正向半场预测"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in form.halfForecastList" >-->
<!--                <span :class="index === 2 ? 'text-red' : ''">-->
<!--                     <el-divider direction="vertical" />-->
<!--                    {{item.name}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.mainWinOdds+"("+item.resultForecast.mainNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.levelWinOdds+"("+item.resultForecast.levelNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.gustWinOdds+"("+item.resultForecast.gustNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                  </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="反向半场预测"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in form.halfReverseForecastList" >-->
<!--                <span :class="index === 2 ? 'text-red' : ''">-->
<!--                     <el-divider direction="vertical" />-->
<!--                    {{item.name}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.mainWinOdds+"("+item.resultForecast.mainNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.levelWinOdds+"("+item.resultForecast.levelNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.gustWinOdds+"("+item.resultForecast.gustNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--      </el-row>-->
      <el-divider content-position="left">让球分析</el-divider>
      <el-row :gutter="12">
        <el-col :span="12">
          <el-card class="box-card">
            <el-descriptions title="让球正向进球预测"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="(item,index) in form.rqJqForecastList" >
                  <span  :class="index === 5 ? 'text-red' : ''">
                    <el-divider direction="vertical" />
                    {{item.name}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.mainWinOdds+"("+item.resultForecast.mainNum+")"}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.levelWinOdds+"("+item.resultForecast.levelNum+")"}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.gustWinOdds+"("+item.resultForecast.gustNum+")"}}
                    <el-divider direction="vertical" />
                    </span>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="12">
          <el-card class="box-card">
            <el-descriptions title="让球反向进球预测"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="(item,index) in form.rqJqReverseForecastList" >
                  <span  :class="index === 5 ? 'text-red' : ''">
                  <el-divider direction="vertical" />
                    {{item.name}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.mainWinOdds+"("+item.resultForecast.mainNum+")"}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.levelWinOdds+"("+item.resultForecast.levelNum+")"}}
                    <el-divider direction="vertical" />
                    {{item.resultForecast.gustWinOdds+"("+item.resultForecast.gustNum+")"}}
                    <el-divider direction="vertical" />
                    </span>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row>
<!--      <el-row :gutter="12">-->
<!--        <el-col :span="12">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="让球正向半场预测"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in form.rqHalfForecastList" >-->
<!--                <span :class="index === 2 ? 'text-red' : ''">-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.name}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.mainWinOdds+"("+item.resultForecast.mainNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.levelWinOdds+"("+item.resultForecast.levelNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.gustWinOdds+"("+item.resultForecast.gustNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="让球反向半场预测"  direction="vertical"  :column="1" >-->
<!--              <el-descriptions-item label="" v-for="(item,index) in form.rqHalfReverseForecastList" >-->
<!--                <span :class="index === 2 ? 'text-red' : ''">-->
<!--                     <el-divider direction="vertical" />-->
<!--                    {{item.name}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.mainWinOdds+"("+item.resultForecast.mainNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.levelWinOdds+"("+item.resultForecast.levelNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                    {{item.resultForecast.gustWinOdds+"("+item.resultForecast.gustNum+")"}}-->
<!--                    <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--      </el-row>-->
      <el-divider content-position="left">价格排序</el-divider>
      <el-row :gutter="12">
        <el-col :span="12">
          <el-card class="box-card">
            <el-descriptions title="进球价格排序"  direction="vertical" :column="3">
              <el-descriptions-item label="" v-for="(item,index) in form.currentJqSortList" >
                <span :class="item.result ? 'text-red' : ''">
                  <el-divider direction="vertical" />
                   {{index+1}}
                  <el-divider direction="vertical" />
                  {{item.name}}
                  <el-divider direction="vertical" />
                  {{item.value}}
                  <el-divider direction="vertical" />
                </span>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="12">
          <el-card class="box-card">
            <el-descriptions title="半场价格排序"  direction="vertical" :column="3">
              <el-descriptions-item label="" v-for="(item,index) in form.halfSortList">
                <span :class="item.result ? 'text-red' : ''">
                   <el-divider direction="vertical" />
                   {{index+1}}
                  <el-divider direction="vertical" />
                  {{item.name}}
                  <el-divider direction="vertical" />
                  {{item.value}}
                  <el-divider direction="vertical" />
                </span>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <el-card class="box-card">
            <el-descriptions title="比分价格排序"  direction="vertical" :column="4">
              <el-descriptions-item label="" v-for="(item,index) in form.matchScoreSort">
             <span :class="item.result ? 'text-red' : ''">
                 <el-divider direction="vertical" />
                 {{index+1}}
                <el-divider direction="vertical" />
                {{item.name}}
                <el-divider direction="vertical" />
                {{item.value}}
                <el-divider direction="vertical" />
              </span>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row>
      <el-divider content-position="left">价格和数量</el-divider>
      <el-row :gutter="5">
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="主-比分及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.mainVO.scoreList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="平-比分及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.levelVO.scoreList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="客-比分及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.gustVO.scoreList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="主-半场及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.mainVO.halfList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="平-半场及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.levelVO.halfList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="客-半场及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.gustVO.halfList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>

      </el-row>
      <el-row :gutter="5">

        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="主-进球及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.mainVO.jqList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="平-进球及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.levelVO.jqList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="客-进球及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.gustVO.jqList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="主-比分价格及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.mainVO.scoreSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
                {{item.minPrice}}
                <el-divider direction="vertical" />
                {{item.maxPrice}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>

        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="平-比分价格及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.levelVO.scoreSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
                {{item.minPrice}}
                <el-divider direction="vertical" />
                {{item.maxPrice}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="客-比分价格及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.gustVO.scoreSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
                {{item.minPrice}}
                <el-divider direction="vertical" />
                {{item.maxPrice}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row>
      <el-row :gutter="5">
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="主-进球价格及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.mainVO.jqSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="平-进球价格及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.levelVO.jqSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="客-进球价格及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.gustVO.jqSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="主-半场价格及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.mainVO.halfSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>

        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="平-半场价格及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.levelVO.halfSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="4">
          <el-card class="box-card">
            <el-descriptions title="客-半场价格及数量"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.gustVO.halfSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row>
      <el-divider content-position="left">综合分析</el-divider>
      <el-row :gutter="5">
        <el-col :span="8">
          <el-card class="box-card">
            <el-descriptions title="主-综合"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.mainVO.rankSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="8">
          <el-card class="box-card">
            <el-descriptions title="平-综合"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.levelVO.rankSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="8">
          <el-card class="box-card">
            <el-descriptions title="客-综合"  direction="vertical" :column="1">
              <el-descriptions-item label="" v-for="item in form.gustVO.rankSortList">
                <el-divider direction="vertical" />
                {{item.label}}
                <el-divider direction="vertical" />
                {{item.num}}
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row>
      <template #footer>
        <div class="dialog-footer">
          <el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </template>
    </el-dialog>

    <el-dialog :title="title2" v-model="open2" width="1500px" append-to-body>
      <el-divider content-position="left">赛果</el-divider>
      <el-row :gutter="12">
        <el-col :span="8">
          <el-card class="box-card">
            <el-descriptions title="赛果" :column="1" >
              <el-descriptions-item label="结果">
                <el-tag class="mx-1" effect="plain" type="success" size="large"  v-if="matchResultShow">
                  {{ matchResult === 3 ? '主' : matchResult === 1 ? '平' : '客'}}
                </el-tag>
                <el-tag class="mx-1" effect="plain" size="large"  v-if="!matchResultShow" @click="matchResultShow = !matchResultShow">
                  -
                </el-tag>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
        <el-col :span="8">
        <el-card class="box-card">
          <el-descriptions title="比分赛果" :column="1" >
            <el-descriptions-item label="比分">
              <el-tag class="mx-1" effect="plain" size="large" type="success"  v-if="matchScoreShow">
                {{ matchScore }}
              </el-tag>
              <el-tag class="mx-1" effect="plain" size="large"  v-if="!matchScoreShow" @click="matchScoreShow = !matchScoreShow">
                -
              </el-tag>
            </el-descriptions-item>
          </el-descriptions>
        </el-card>
        </el-col>
        <el-col :span="8">
          <el-card class="box-card">
            <el-descriptions title="让球赛果" :column="1" >
              <el-descriptions-item label="让球赛果">
                <el-tag class="mx-1" effect="plain" size="large" type="success"  v-if="matchRqResultShow">
                  {{ matchRqResult === 3 ? '主' : matchRqResult === 1 ? '平' : '客'}}
                </el-tag>
                <el-tag class="mx-1" effect="plain" size="large"  v-if="!matchRqResultShow" @click="matchRqResultShow = !matchRqResultShow">
                  -
                </el-tag>
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row >
      <el-divider content-position="left">基础信息</el-divider>
      <el-row :gutter="12">
        <el-col :span="12"   v-for="item in baseInfo.jcOdds">
          <el-card class="box-card">
            <el-descriptions :title="item.initFlag ? '竞彩-初' : '竞彩-终'" :column="3" >
              <el-descriptions-item label="主胜">{{item.mainWinOdds}}</el-descriptions-item>
              <el-descriptions-item label="平胜">{{item.levelOdds}}</el-descriptions-item>
              <el-descriptions-item label="客胜">{{item.gustWinOdds}}</el-descriptions-item>
              <el-descriptions-item v-if="item.initFlag" label="主胜(让)">{{baseInfo.rqGustWinOdds}}</el-descriptions-item>
              <el-descriptions-item v-if="item.initFlag" label="平胜(让)">{{baseInfo.rqLevelOdds}}</el-descriptions-item>
              <el-descriptions-item v-if="item.initFlag" label="客胜(让)">{{baseInfo.rqMainWinOdds}}</el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row >
      <el-row :gutter="12" >
        <el-col :span="12" v-for="item in baseInfo.vlOdds">
          <el-card class="box-card">
            <el-descriptions :title="item.initFlag ? '威廉-初' : '威廉-终'" :column="3">
              <el-descriptions-item label="主胜">{{item.mainWinOdds}}</el-descriptions-item>
              <el-descriptions-item label="平胜">{{item.levelOdds}}</el-descriptions-item>
              <el-descriptions-item label="客胜">{{item.gustWinOdds}}</el-descriptions-item>

            </el-descriptions>
          </el-card>
        </el-col>
      </el-row >
      <el-row :gutter="12" >
        <el-col :span="12" v-for="item in baseInfo.lbOdds">
          <el-card class="box-card">
            <el-descriptions :title="item.initFlag ? '立博-初' : '立博-终'" :column="3">
              <el-descriptions-item label="主胜">{{item.mainWinOdds}}</el-descriptions-item>
              <el-descriptions-item label="平胜">{{item.levelOdds}}</el-descriptions-item>
              <el-descriptions-item label="客胜">{{item.gustWinOdds}}</el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row >
      <el-row :gutter="12" >
        <el-col :span="12" v-for="item in riskAssessments">
          <el-card class="box-card">
            <el-descriptions :title="item.initFlag ? '初' : '终'" :column="3">
              <el-descriptions-item label="主">{{item.main}}</el-descriptions-item>
              <el-descriptions-item label="平">{{item.level}}</el-descriptions-item>
              <el-descriptions-item label="客">{{item.gust}}</el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row >

      <el-divider content-position="left">竞彩比分分布</el-divider>
<!--      <el-row>-->
<!--        <el-col>-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="范围(0~17)"  direction="vertical" :column="3">-->
<!--              <el-descriptions-item label="主" >-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ rang1.mainNum}}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ calculatePercentage2(rang1.mainNum,13) }}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--              </el-descriptions-item>-->
<!--              <el-descriptions-item label="平">-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ rang1.levelNum}}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ calculatePercentage2(rang1.levelNum,5) }}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--              </el-descriptions-item>-->
<!--              <el-descriptions-item label="客">-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ rang1.gustNum}}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ calculatePercentage2(rang1.gustNum,13) }}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--            <el-descriptions title="范围(17~90)"  direction="vertical" :column="3">-->
<!--              <el-descriptions-item label="  主" >-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ rang2.mainNum}}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ calculatePercentage2(rang2.mainNum,13) }}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--              </el-descriptions-item>-->
<!--              <el-descriptions-item label="平">-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ rang2.levelNum}}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ calculatePercentage2(rang2.levelNum,5) }}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--              </el-descriptions-item>-->
<!--              <el-descriptions-item label="客">-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ rang2.gustNum}}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ calculatePercentage2(rang2.gustNum,13) }}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--            <el-descriptions title="范围(90~1000)"  direction="vertical" :column="3">-->
<!--              <el-descriptions-item label="  主" >-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ rang3.mainNum}}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ calculatePercentage2(rang3.mainNum,13) }}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--              </el-descriptions-item>-->
<!--              <el-descriptions-item label="平">-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ rang3.levelNum}}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ calculatePercentage2(rang3.levelNum,5) }}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--              </el-descriptions-item>-->
<!--              <el-descriptions-item label="客">-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ rang3.gustNum}}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--                <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                  {{ calculatePercentage2(rang3.gustNum,13) }}-->
<!--                </el-button>-->

<!--                <el-divider direction="vertical" />-->

<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--      </el-row>-->
      <el-row>
        <el-col>
          <el-button :type="mainButton ? 'primary' : ''" @click="mainButton = !mainButton">主</el-button>
          <el-button :type="levelButton ? 'success' : ''" @click="levelButton = !levelButton">平</el-button>
          <el-button :type="gustButton ? 'info' : '' " @click="gustButton = !gustButton">客</el-button>
        </el-col>
      </el-row>
      <el-row >
        <el-col>
          <el-card class="box-card">
            <div class="cs_table">
              <table>
                <thead>
                <tr>
                  <th v-for="head in currentMatchRangeList">
                    {{head.type}}
                  </th>
                </tr>
                </thead>
                <tbody>
                <tr >
                  <td v-for="body in  currentMatchRangeList">
                    <el-row v-for="bd in body.csList"  type="flex" justify="center">
                      <el-button class="mt5"
                                 tag="div"
                                 role="button"
                                 :type="(bd.rqLabel === '主' && mainButton) ? 'primary' : (bd.rqLabel === '平' && levelButton) ? 'success' : (bd.rqLabel === '客' && gustButton) ? 'info' : '' "
                                 @click="scoreClick(bd.label)">
                        {{bd.label}}<br/>{{bd.price}}
                      </el-button>
                    </el-row>

                  </td>

                </tr>
                </tbody>
              </table>
            </div>
          </el-card>
        </el-col>
      </el-row>


      <el-divider content-position="left">让球分布</el-divider>
      <el-row :gutter="12">
        <el-col>
          <el-card class="box-card">
            <el-descriptions title="让球分布(初)"  direction="vertical" :column="3">
              <el-descriptions-item label="" >
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">
                  主
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">
                  {{ rqInitNum.mainNum}}
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">
                  {{ calculatePercentage(rqInitNum.mainNum,rqInitNum.levelNum,rqAllNum.gustNum) }}
                </el-button>
                <el-divider direction="vertical" />
              </el-descriptions-item>
              <el-descriptions-item label="" @click="rqFbClick('平')">
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">
                  平
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">
                  {{rqInitNum.levelNum}}
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('平')">
                  {{ calculatePercentage(rqInitNum.levelNum,rqInitNum.mainNum,rqAllNum.gustNum) }}
                </el-button>
                <el-divider direction="vertical" />
              </el-descriptions-item>
              <el-descriptions-item label="" @click="rqFbClick('客')">
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">
                  客
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">
                  {{rqInitNum.gustNum}}
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('客')">
                  {{ calculatePercentage(rqInitNum.gustNum,rqInitNum.mainNum,rqInitNum.levelNum) }}
                </el-button>
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>

            <el-descriptions title="让球分布(终)"  direction="vertical" :column="3">
              <el-descriptions-item label="" >
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">
                  主
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">
                  {{rqFinalNum.mainNum}}
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">
                  {{ calculatePercentage(rqFinalNum.mainNum,rqFinalNum.levelNum,rqFinalNum.gustNum) }}
                </el-button>
                <el-divider direction="vertical" />
              </el-descriptions-item>
              <el-descriptions-item label="" @click="rqFbClick('平')">
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">
                  平
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">
                  {{rqFinalNum.levelNum}}
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('平')">
                  {{ calculatePercentage(rqFinalNum.levelNum,rqFinalNum.mainNum,rqFinalNum.gustNum) }}
                </el-button>
                <el-divider direction="vertical" />
              </el-descriptions-item>
              <el-descriptions-item label="" @click="rqFbClick('客')">
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">
                  客
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">
                  {{rqFinalNum.gustNum}}
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('客')">
                  {{ calculatePercentage(rqFinalNum.gustNum,rqFinalNum.levelNum,rqFinalNum.mainNum) }}
                </el-button>
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>


            <el-descriptions title="让球分布(总)"  direction="vertical" :column="3">
              <el-descriptions-item label="" >
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">
                  主
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">
                  {{rqAllNum.mainNum}}
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">
                  {{ calculatePercentage(rqAllNum.mainNum,rqAllNum.levelNum,rqAllNum.gustNum) }}
                </el-button>
                <el-divider direction="vertical" />
              </el-descriptions-item>
              <el-descriptions-item label="" @click="rqFbClick('平')">
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">
                  平
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">
                  {{rqAllNum.levelNum}}
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('平')">
                  {{ calculatePercentage(rqAllNum.levelNum,rqAllNum.mainNum,rqAllNum.gustNum) }}
                </el-button>
                <el-divider direction="vertical" />
              </el-descriptions-item>
              <el-descriptions-item label="" @click="rqFbClick('客')">
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">
                  客
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">
                  {{rqAllNum.gustNum}}
                </el-button>
                <el-divider direction="vertical" />
                <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('客')">
                  {{ calculatePercentage(rqAllNum.gustNum,rqAllNum.levelNum,rqAllNum.mainNum) }}
                </el-button>
                <el-divider direction="vertical" />
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row>
<!--      <el-row :gutter="12">-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="竞彩初赔让球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in jcInit.rqList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="竞彩终赔让球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in jcFinal.rqList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="威廉初赔让球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in vlInit.rqList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="威廉终赔让球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in vlFinal.rqList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="立博初赔让球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in lbInit.rqList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="立博终赔让球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in lbFinal.rqList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--      </el-row>-->

      <el-divider content-position="left">进球分布</el-divider>
      <el-row >
        <el-col>
          <el-card class="box-card">
            <div class="cs_table">
              <table>
                <thead>
                <tr>
                  <th>进球0</th>
                  <th>进球1</th>
                  <th>进球2</th>
                  <th>进球3</th>
                  <th>进球4</th>
                  <th>进球5</th>
                  <th>进球6</th>
                  <th>大于6</th>
                </tr>
                </thead>
                <tbody>
                <tr >
                  <td> <el-button class="mt5" tag="div" role="button">{{baseInfo.jq0}}</el-button></td>
                  <td> <el-button class="mt5" tag="div" role="button">{{baseInfo.jq1}}</el-button></td>
                  <td> <el-button class="mt5" tag="div" role="button">{{baseInfo.jq2}}</el-button></td>
                  <td> <el-button class="mt5" tag="div" role="button">{{baseInfo.jq3}}</el-button></td>
                  <td> <el-button class="mt5" tag="div" role="button">{{baseInfo.jq4}}</el-button></td>
                  <td> <el-button class="mt5" tag="div" role="button">{{baseInfo.jq5}}</el-button></td>
                  <td> <el-button class="mt5" tag="div" role="button">{{baseInfo.jq6}}</el-button></td>
                  <td> <el-button class="mt5" tag="div" role="button">{{baseInfo.jqGt6}}</el-button></td>
                </tr>
                </tbody>
              </table>
            </div>
          </el-card>
        </el-col>
      </el-row>
      <el-row :gutter="12">
        <el-col :span="3">
          <el-card class="box-card">
            <el-descriptions title="总进球数0"  direction="vertical" :column="1">
              <el-descriptions-item label="">
               <span class="text-red"> 均</span>
                <el-divider direction="vertical" />
                <span class="text-red"> {{jq0Avg}}</span>
              </el-descriptions-item>
              <el-descriptions-item label="" v-for="(item,index) in jq0List">
                {{index}}
                <el-divider direction="vertical" />
                <span v-if="item.price === baseInfo.jq0" class="text-midnightblue">{{item.price}}</span>
                <span v-else-if="item.price === jq0Avg" class="text-gold">{{item.price}}</span>
                <span v-else :class="(Number(item.price) > baseInfo.jq0) ? 'text-red' : (Number(item.price) < jq0Avg) ? 'text-blue' : 'text-black'">{{item.price}}</span>
                <el-divider direction="vertical" />
                {{item.num}}
              </el-descriptions-item>

            </el-descriptions>
          </el-card>
        </el-col>

        <el-col :span="3">
          <el-card class="box-card">
            <el-descriptions title="总进球数1"  direction="vertical" :column="1">
              <el-descriptions-item label="">
                <span class="text-red"> 均</span>
                <el-divider direction="vertical" />
                <span class="text-red"> {{jq1Avg}}</span>
              </el-descriptions-item>
              <el-descriptions-item label="" v-for="(item,index) in jq1List">
                {{index}}
                <el-divider direction="vertical" />
                <span v-if="item.price === baseInfo.jq1" class="text-midnightblue">{{item.price}}</span>
                <span v-else-if="item.price === jq1Avg" class="text-gold">{{item.price}}</span>
                <span v-else :class="(Number(item.price) > baseInfo.jq1) ? 'text-red' :  (Number(item.price) < jq1Avg) ? 'text-blue' : 'text-black'">{{item.price}}</span>
                <el-divider direction="vertical" />
                {{item.num}}
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>

        <el-col :span="3">
          <el-card class="box-card">
            <el-descriptions title="总进球数2"  direction="vertical" :column="1">
              <el-descriptions-item label="">
                <span class="text-red"> 均</span>
                <el-divider direction="vertical" />
                <span class="text-red"> {{jq2Avg}}</span>
              </el-descriptions-item>
              <el-descriptions-item label="" v-for="(item,index) in jq2List">
                {{index}}
                <el-divider direction="vertical" />
                <span v-if="item.price === baseInfo.jq2" class="text-midnightblue">{{item.price}}</span>
                <span v-else-if="item.price === jq2Avg" class="text-gold">{{item.price}}</span>
                <span v-else :class="(Number(item.price) > baseInfo.jq2) ? 'text-red' :  (Number(item.price) < jq2Avg) ? 'text-blue' :  'text-black'">{{item.price}}</span>
                <el-divider direction="vertical" />
                {{item.num}}
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>

        <el-col :span="3">
          <el-card class="box-card">
            <el-descriptions title="总进球数3"  direction="vertical" :column="1">
              <el-descriptions-item label="">
                <span class="text-red"> 均</span>
                <el-divider direction="vertical" />
                <span class="text-red"> {{jq3Avg}}</span>
              </el-descriptions-item>
              <el-descriptions-item label="" v-for="(item,index) in jq3List">
                <el-divider direction="vertical" />
                {{index}}
                <el-divider direction="vertical" />
                <span v-if="item.price === baseInfo.jq3" class="text-midnightblue">{{item.price}}</span>
                <span v-else-if="item.price === jq3Avg" class="text-gold">{{item.price}}</span>
                <span v-else :class="(Number(item.price) > baseInfo.jq3) ? 'text-red' :   (Number(item.price) < jq3Avg) ? 'text-blue' : 'text-black'">{{item.price}}</span>
                <el-divider direction="vertical" />
                {{item.num}}
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>

        <el-col :span="3">
          <el-card class="box-card">
            <el-descriptions title="总进球数4"  direction="vertical" :column="1">
              <el-descriptions-item label="">
                <span class="text-red"> 均</span>
                <el-divider direction="vertical" />
                <span class="text-red"> {{jq4Avg}}</span>
              </el-descriptions-item>
              <el-descriptions-item label="" v-for="(item,index) in jq4List">
                {{index}}
                <el-divider direction="vertical" />
                <span v-if="item.price === baseInfo.jq4" class="text-midnightblue">{{item.price}}</span>
                <span v-else-if="item.price === jq4Avg" class="text-gold">{{item.price}}</span>
                <span v-else :class="(Number(item.price) > baseInfo.jq4) ? 'text-red' :   (Number(item.price) < jq4Avg) ? 'text-blue' :  'text-black'">{{item.price}}</span>
                <el-divider direction="vertical" />
                {{item.num}}
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>

        <el-col :span="3">
          <el-card class="box-card">
            <el-descriptions title="总进球数5"  direction="vertical" :column="1">
              <el-descriptions-item label="">
                <span class="text-red"> 均</span>
                <el-divider direction="vertical" />
                <span class="text-red"> {{jq5Avg}}</span>
              </el-descriptions-item>
              <el-descriptions-item label="" v-for="(item,index) in jq5List">
                {{index}}
                <el-divider direction="vertical" />
                <span v-if="item.price === baseInfo.jq5" class="text-midnightblue">{{item.price}}</span>
                <span v-else-if="item.price === jq5Avg" class="text-gold">{{item.price}}</span>
                <span v-else :class="(Number(item.price) > baseInfo.jq5) ? 'text-red' :   (Number(item.price) < jq5Avg) ? 'text-blue' : 'text-black'">{{item.price}}</span>
                <el-divider direction="vertical" />
                {{item.num}}
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>

        <el-col :span="3">
          <el-card class="box-card">
            <el-descriptions title="总进球数6"  direction="vertical" :column="1">
              <el-descriptions-item label="">
                <span class="text-red"> 均</span>
                <el-divider direction="vertical" />
                <span class="text-red"> {{jq6Avg}}</span>
              </el-descriptions-item>
              <el-descriptions-item label="" v-for="(item,index) in jq6List">
                {{index}}
                <el-divider direction="vertical" />
                <span v-if="item.price === baseInfo.jq6" class="text-midnightblue">{{item.price}}</span>
                <span v-else-if="item.price === jq6Avg" class="text-gold">{{item.price}}</span>
                <span v-else :class="(Number(item.price) > baseInfo.jq6) ? 'text-red' :   (Number(item.price) < jq6Avg) ? 'text-blue' : 'text-black'">{{item.price}}</span>
                <el-divider direction="vertical" />
                {{item.num}}
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>

        <el-col :span="3">
          <el-card class="box-card">
            <el-descriptions title="总进球数大于6"  direction="vertical" :column="1">
              <el-descriptions-item label="">
                <span class="text-red"> 均</span>
                <el-divider direction="vertical" />
                <span class="text-red"> {{jq7Avg}}</span>
              </el-descriptions-item>
              <el-descriptions-item label="" v-for="(item,index) in jqGt6List">
                {{index}}
                <el-divider direction="vertical" />
                <span v-if="item.price === baseInfo.jqGt6" class="text-midnightblue">{{item.price}}</span>
                <span v-else-if="item.price === jq7Avg" class="text-gold">{{item.price}}</span>
                <span v-else :class="(Number(item.price) > baseInfo.jqGt6) ? 'text-red' :  (Number(item.price) < jq7Avg) ? 'text-blue' :  'text-black'">{{item.price}}</span>
                <el-divider direction="vertical" />
                {{item.num}}
              </el-descriptions-item>
            </el-descriptions>
          </el-card>
        </el-col>
      </el-row>
<!--      <el-row :gutter="12">-->
<!--        <el-col>-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="进球分布"  direction="vertical" :column="3">-->
<!--              <el-descriptions-item label="初" >-->
<!--                <div v-for="ij in initJqNumList">-->
<!--                  <el-divider direction="vertical" />-->
<!--                  <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                      {{ij.desc +"("+ij.num+")"}}-->
<!--                  </el-button>-->
<!--                  <el-divider direction="vertical" />-->
<!--                </div>-->
<!--              </el-descriptions-item>-->
<!--              <el-descriptions-item label="终" >-->
<!--                <div v-for="ij in finalJqNumList">-->
<!--                  <el-divider direction="vertical" />-->
<!--                  <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                    {{ij.desc +"("+ij.num+")"}}-->
<!--                  </el-button>-->
<!--                  <el-divider direction="vertical" />-->
<!--                </div>-->
<!--              </el-descriptions-item>-->
<!--              <el-descriptions-item label="总">-->
<!--                <div v-for="ij in allJqNumList">-->
<!--                  <el-divider direction="vertical" />-->
<!--                  <el-button size="small" class="mt5" tag="div" role="button">-->
<!--                    {{ij.desc +"("+ij.num+")"}}-->
<!--                  </el-button>-->
<!--                  <el-divider direction="vertical" />-->
<!--                </div>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--      </el-row>-->
<!--      <el-row :gutter="12">-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="竞彩初赔进球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in jcInit.jqList" >-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="竞彩终赔进球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in jcFinal.jqList" >-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="威廉初赔进球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in vlInit.jqList" >-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="威廉终赔进球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in vlFinal.jqList" >-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="立博初赔进球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in lbInit.jqList" >-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="立博终赔进球分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in lbFinal.jqList" >-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--      </el-row>-->

<!--      <el-divider content-position="left">比分分布</el-divider>-->
<!--      <el-col>-->
<!--        <el-card class="box-card">-->
<!--          <el-descriptions title="比分分布(初)"  direction="vertical" :column="3">-->
<!--            <el-descriptions-item label="" >-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">-->
<!--                主-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">-->
<!--                {{ scoreInitNum.mainNum}}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">-->
<!--                {{ calculatePercentage(scoreInitNum.mainNum,scoreInitNum.levelNum,scoreInitNum.gustNum) }}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--            </el-descriptions-item>-->
<!--            <el-descriptions-item label="" @click="rqFbClick('平')">-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">-->
<!--                平-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">-->
<!--                {{scoreInitNum.levelNum}}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('平')">-->
<!--                {{ calculatePercentage(scoreInitNum.levelNum,scoreInitNum.mainNum,scoreInitNum.gustNum) }}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--            </el-descriptions-item>-->
<!--            <el-descriptions-item label="" @click="rqFbClick('客')">-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">-->
<!--                客-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">-->
<!--                {{scoreInitNum.gustNum}}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('客')">-->
<!--                {{ calculatePercentage(scoreInitNum.gustNum,scoreInitNum.mainNum,scoreInitNum.levelNum) }}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--            </el-descriptions-item>-->
<!--          </el-descriptions>-->

<!--          <el-descriptions title="比分分布(终)"  direction="vertical" :column="3">-->
<!--            <el-descriptions-item label="" >-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">-->
<!--                主-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">-->
<!--                {{scoreFinalNum.mainNum}}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">-->
<!--                {{ calculatePercentage(scoreFinalNum.mainNum,scoreFinalNum.levelNum,scoreFinalNum.gustNum) }}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--            </el-descriptions-item>-->
<!--            <el-descriptions-item label="" @click="rqFbClick('平')">-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">-->
<!--                平-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">-->
<!--                {{scoreFinalNum.levelNum}}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('平')">-->
<!--                {{ calculatePercentage(scoreFinalNum.levelNum,scoreFinalNum.mainNum,scoreFinalNum.gustNum) }}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--            </el-descriptions-item>-->
<!--            <el-descriptions-item label="" @click="rqFbClick('客')">-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">-->
<!--                客-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">-->
<!--                {{scoreFinalNum.gustNum}}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('客')">-->
<!--                {{ calculatePercentage(scoreFinalNum.gustNum,scoreFinalNum.levelNum,scoreFinalNum.mainNum) }}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--            </el-descriptions-item>-->
<!--          </el-descriptions>-->


<!--          <el-descriptions title="比分分布(总)"  direction="vertical" :column="3">-->
<!--            <el-descriptions-item label="" >-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">-->
<!--                主-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">-->
<!--                {{scoreAllNum.mainNum}}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('主')">-->
<!--                {{ calculatePercentage(scoreAllNum.mainNum,scoreAllNum.levelNum,scoreAllNum.gustNum) }}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--            </el-descriptions-item>-->
<!--            <el-descriptions-item label="" @click="rqFbClick('平')">-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">-->
<!--                平-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '平' ? 'success' : '' " @click="rqFbClick('平')">-->
<!--                {{scoreAllNum.levelNum}}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('平')">-->
<!--                {{ calculatePercentage(scoreAllNum.levelNum,scoreAllNum.mainNum,scoreAllNum.gustNum) }}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--            </el-descriptions-item>-->
<!--            <el-descriptions-item label="" @click="rqFbClick('客')">-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">-->
<!--                客-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '客' ? 'success' : '' " @click="rqFbClick('客')">-->
<!--                {{scoreAllNum.gustNum}}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--              <el-button size="small" class="mt5" tag="div" role="button" :type="rqLabel === '主' ? 'success' : '' " @click="rqFbClick('客')">-->
<!--                {{ calculatePercentage(scoreAllNum.gustNum,scoreAllNum.levelNum,scoreAllNum.mainNum) }}-->
<!--              </el-button>-->
<!--              <el-divider direction="vertical" />-->
<!--            </el-descriptions-item>-->
<!--          </el-descriptions>-->
<!--        </el-card>-->
<!--      </el-col>-->
<!--      <el-row :gutter="12">-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="竞彩初赔比分分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in jcInit.scoreList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="竞彩终赔比分分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in jcFinal.scoreList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="威廉初赔比分分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in vlInit.scoreList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="威廉终赔比分分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in vlFinal.scoreList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="立博初赔比分分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in lbInit.scoreList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <el-card class="box-card">-->
<!--            <el-descriptions title="立博终赔比分分布"  direction="vertical" :column="1">-->
<!--              <el-descriptions-item label="" v-for="(item,index) in lbFinal.scoreList">-->
<!--                <span :class="item.result ? 'text-red' : ''">-->
<!--                   <el-divider direction="vertical" />-->
<!--                 {{index+1}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.desc}}-->
<!--                <el-divider direction="vertical" />-->
<!--                {{item.num}}-->
<!--                <el-divider direction="vertical" />-->
<!--                </span>-->
<!--              </el-descriptions-item>-->
<!--            </el-descriptions>-->
<!--          </el-card>-->
<!--        </el-col>-->
<!--      </el-row>-->
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="cancel2">取 消</el-button>
        </div>
      </template>
    </el-dialog>

    <match-range ref="matchRangeRef"></match-range>
  </div>
</template>

<script setup name="HistoryMatch">
import { listHistoryMatch, getHistoryMatch, delHistoryMatch, addHistoryMatch, updateHistoryMatch,getHistoryMatch2 } from "@/api/match/historyMatch";
import MatchRange from "@/views/match/commons/MatchRange.vue";



const { proxy } = getCurrentInstance();

const historyMatchList = ref([]);
const open = ref(false);
const open2 = ref(false);
const buttonLoading = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");
const title2 = ref("");
const matchResultShow = ref(false);
const matchResult = ref("");
const matchScore = ref("");
const matchScoreShow = ref(false);
const matchRqResultShow = ref(false);
const matchRqResult = ref("");

const buttonList = ref([])

const mainButton = ref(true)
const levelButton = ref(true)
const gustButton = ref(true)

const matchRangeRef = ref();

const data = reactive({
  form: {},
  baseInfo: {},
  jcInit: [],
  jcFinal: [],
  lbInit: [],
  lbFinal: [],
  vlFinal: [],
  vlInit: [],
  riskAssessments: [],
  rqInitNum: {},
  rqFinalNum: {},
  rqAllNum: {},

  scoreInitNum: {},
  scoreFinalNum: {},
  scoreAllNum: {},

  initJqNumList: {},
  finalJqNumList: {},
  allJqNumList: {},
  currentMatchRangeList: [],

  rang1:{},
  rang2:{},
  rang3:{},

  jq0List: [],
  jq1List: [],
  jq2List: [],
  jq3List: [],
  jq4List: [],
  jq5List: [],
  jq6List: [],
  jqGt6List: [],

  jq0Avg: undefined,
  jq1Avg: undefined,
  jq2Avg: undefined,
  jq3Avg: undefined,
  jq4Avg: undefined,
  jq5Avg: undefined,
  jq6Avg: undefined,
  jq7Avg: undefined,

  queryParams: {
    pageNum: 1,
    pageSize: 20,
    matchDate: undefined,
    matchFlag: undefined,
    mainTeamName: undefined,
    gustTeamName: undefined,
    rq: undefined,
    minMainWinOdds: undefined,
    maxMainWinOdds: undefined,
    levelOdds: undefined,
    minGustWinOdds: undefined,
    maxGustWinOdds: undefined,
    rqMinMainWinOdds: undefined,
    rqMaxMainWinOdds: undefined,
    rqLevelOdds: undefined,
    rqMinGustWinOdds: undefined,
    rqMaxGustWinOdds: undefined,
    levelOther: undefined,
    winOther: undefined,
    lostOther: undefined,
    jq0: undefined,
    jq1: undefined,
    jq2: undefined,
    jq3: undefined,
    jq4: undefined,
    jq5: undefined,
    jq6: undefined,
    jqGt6: undefined,
    matchResult: undefined,
    matchScore: undefined,
    rqResult: undefined,
  },
});
const { queryParams, form, rules, baseInfo,
  currentMatchRangeList,jcInit,jcFinal,lbInit,lbFinal,vlInit,vlFinal,
  riskAssessments,rqInitNum,rqFinalNum,rqAllNum,initJqNumList,finalJqNumList,
  allJqNumList,scoreInitNum,scoreFinalNum,scoreAllNum,rang1,rang2,rang3,jq0List,jq1List,jq2List,jq3List,jq4List,jq5List,jq6List,jqGt6List,
  jq0Avg,jq1Avg,jq2Avg,jq3Avg,jq4Avg,jq5Avg,jq6Avg,jq7Avg} = toRefs(data);
const rqLabel = ref("")

function calculatePercentage2(a,b) {
  return ((Number(a)/Number(b))*100).toFixed(2)+'%'
}
function calculatePercentage(a,b,c) {
  return ((Number(a)/(Number(a)+Number(b)+Number(c)))*100).toFixed(2)+'%'
}
function rqFbClick(target) {
  console.log(target)
 if(rqLabel.value === target){
    rqLabel.value = ""
  }else{
    rqLabel.value = target;
  }
}

function scoreClick(target) {
  if( buttonList.value.includes(target)){
    buttonList.value = buttonList.value.filter(item => item !== target);
  }else {
    buttonList.value.push(target)
  }
}



/** 查询【请填写功能名称】列表 */
function getList() {
  loading.value = true;
  listHistoryMatch(queryParams.value).then(response => {
    historyMatchList.value = response.rows;
    total.value = response.total;
    loading.value = false;
  });
}

// 取消按钮
function cancel() {
  open.value = false;
  reset();
}

function cancel2() {
  open2.value = false;
}

// 表单重置
function reset() {
  form.value = {
    id: null,
    matchDate: null,
    matchFlag: null,
    mainTeamName: null,
    gustTeamName: null,
    rq: null,
    mainWinOdds: null,
    levelOdds: null,
    gustWinOdds: null,
    rqMainWinOdds: null,
    rqLevelOdds: null,
    rqGustWinOdds: null,
    cs01: null,
    cs02: null,
    cs03: null,
    cs04: null,
    cs05: null,
    cs10: null,
    cs12: null,
    cs13: null,
    cs14: null,
    cs15: null,
    cs20: null,
    cs21: null,
    cs23: null,
    cs24: null,
    cs25: null,
    cs30: null,
    cs31: null,
    cs32: null,
    cs40: null,
    cs41: null,
    cs42: null,
    cs50: null,
    cs51: null,
    cs52: null,
    level00: null,
    level11: null,
    level22: null,
    level33: null,
    levelOther: null,
    winOther: null,
    lostOther: null,
    jq0: null,
    jq1: null,
    jq2: null,
    jq3: null,
    jq4: null,
    jq5: null,
    jq6: null,
    jqGt6: null,
    matchResult: null,
    matchScore: null,
    createBy: null,
    createTime: null,
    updateBy: null,
    updateTime: null,
    remark: null
  };
  proxy.resetForm("historyMatchRef");
}

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.value.pageNum = 1;
  getList();
}

/** 重置按钮操作 */
function resetQuery() {
  proxy.resetForm("queryRef");
  handleQuery();
}

// 多选框选中数据
function handleSelectionChange(selection) {
  ids.value = selection.map(item => item.id);
  single.value = selection.length != 1;
  multiple.value = !selection.length;
}

/** 新增按钮操作 */
function handleAdd() {
  reset();
  open.value = true;
  title.value = "添加【请填写功能名称】";
}

/** 修改按钮操作 */
function handleView(row) {
  loading.value = true
  reset();
  const _id = row.id || ids.value
  getHistoryMatch(_id,false).then(response => {
    loading.value = false;
    form.value = response.data;
    open.value = true;
    title.value = row.mainTeamName + " VS " + row.gustTeamName + "("+row.matchScore+")" + "("+row.rq+")";
  });
}
function handleMaxView(row) {
  loading.value = true
  reset();
  const _id = row.id || ids.value
  getHistoryMatch(_id,true).then(response => {
    loading.value = false;
    form.value = response.data;

    open.value = true;
    title.value = row.mainTeamName + " VS " + row.gustTeamName + "("+row.matchScore+")" + "("+row.rq+")";
  });
}
function historyView(row) {
  loading.value = true
  const _id = row.id || ids.value
  getHistoryMatch2(_id).then(response => {
    loading.value = false;
    baseInfo.value = response.data.baseInfo;
    currentMatchRangeList.value = response.data.currentMatchRangeList;
    jcInit.value = response.data.jcInit;
    jcFinal.value = response.data.jcFinal;
    lbInit.value = response.data.lbInit;
    lbFinal.value = response.data.lbFinal;
    vlInit.value = response.data.vlInit;
    vlFinal.value = response.data.vlFinal;
    rqInitNum.value = response.data.rqInitNumVO;
    rqFinalNum.value = response.data.rqFinalNumVO;
    rqAllNum.value = response.data.rqAllNumVO;
    riskAssessments.value = response.data.riskAssessments;
    open2.value = true;
    matchResult.value = row.matchResult
    matchScore.value = row.matchScore
    matchRqResult.value = row.rqResult
    matchResultShow.value = false;
    matchRqResultShow.value = false;
    matchScoreShow.value = false;
    mainButton.value = true;
    levelButton.value = true;
    gustButton.value = true;
    initJqNumList.value = response.data.initJqNumList;
    finalJqNumList.value = response.data.finalJqNumList;
    allJqNumList.value = response.data.allJqNumList;

    scoreInitNum.value = response.data.scoreInitNumVO;
    scoreFinalNum.value = response.data.scoreFinalNumVO;
    scoreAllNum.value = response.data.scoreAllNumVO;

    rqLabel.value = ""
    buttonList.value = []

    rang1.value = response.data.rang1
    rang2.value = response.data.rang2
    rang3.value = response.data.rang3

    jq0List.value = response.data.jq0List
    jq1List.value = response.data.jq1List
    jq2List.value = response.data.jq2List
    jq3List.value = response.data.jq3List
    jq4List.value = response.data.jq4List
    jq5List.value = response.data.jq5List
    jq6List.value = response.data.jq6List
    jqGt6List.value = response.data.jqGt6List


    jq0Avg.value = response.data.jq0Avg
    jq1Avg.value = response.data.jq1Avg
    jq2Avg.value = response.data.jq2Avg
    jq3Avg.value = response.data.jq3Avg
    jq4Avg.value = response.data.jq4Avg
    jq5Avg.value = response.data.jq5Avg
    jq6Avg.value = response.data.jq6Avg
    jq7Avg.value = response.data.jq7Avg

    title2.value = row.mainTeamName + " VS " + row.gustTeamName + "("+row.rq+")";
  });
}
/** 提交按钮 */
function submitForm() {
  proxy.$refs["historyMatchRef"].validate(valid => {
    if (valid) {
      buttonLoading.value = true;
      if (form.value.id != null) {
        updateHistoryMatch(form.value).then(response => {
          proxy.$modal.msgSuccess("修改成功");
          open.value = false;
          getList();
        }).finally(() => {
          buttonLoading.value = false;
        });
      } else {
        addHistoryMatch(form.value).then(response => {
          proxy.$modal.msgSuccess("新增成功");
          open.value = false;
          getList();
        }).finally(() => {
          buttonLoading.value = false;
        });
      }
    }
  });
}

/** 删除按钮操作 */
function handleDelete(row) {
  const _ids = row.id || ids.value;
  proxy.$modal.confirm('是否确认删除【请填写功能名称】编号为"' + _ids + '"的数据项？').then(function() {
    loading.value = true;
    return delHistoryMatch(_ids);
  }).then(() => {
    loading.value = true;
    getList();
    proxy.$modal.msgSuccess("删除成功");
  }).catch(() => {
  }).finally(() => {
    loading.value = false;
  });
}

/** 导出按钮操作 */
function handleExport() {
  proxy.download('match/historyMatch/export', {
    ...queryParams.value
  }, `historyMatch_${new Date().getTime()}.xlsx`)
}

getList();
</script>
<style lang="scss">
.cs_table table{
  width: 100%;
  font-size: 12px;
  text-align: center;
  border-style: solid;
  border-color: red;
  border-width: 1px;
  tr{
    border:  1px solid red;
    th{
      border:  1px solid red;
      text-align: center;
    }
    td{
      text-align: center;
      border:  1px solid red;
    }
  }
}
.text-red{
  color: red;
  font-weight: 600;
}
.text-black{
  color: black;
  font-weight: 600;
}
.text-blue{
  color: blue;
  font-weight: 600;
}
.text-gold{
  color: gold;
  font-weight: 1000;
}
.text-midnightblue{
  color: midnightblue;
  font-weight: 1000;
}
.box-card{
  margin-top: 10px;
}
.rqBak {
  background-color: red;
}
.divider-top{
  border-top: 2px solid red;
}
</style>
